<!doctype html>
<html class="no-js">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>{$title}</title>
<meta name="description" content="{$description}" />
<meta name="keywords" content="{$keywords}" />
<!-- Set render engine for 360 browser -->
<meta name="renderer" content="webkit">
<!-- No Baidu Siteapp-->
<meta http-equiv="Cache-Control" content="no-siteapp"/>
<link rel="stylesheet" href="__PUBLIC__/amazeui/css/amazeui.min.css">
<link rel="stylesheet" href="__PUBLIC__/css/common.css">
<link rel="stylesheet" href="__CSS__/style.css">
<!--在这里编写你的代码-->
<script src="__PUBLIC__/jquery.min.js"></script>
<script src="__PUBLIC__/amazeui/js/amazeui.js"></script>
<!--[if lte IE 8 ]>
<script src="__PUBLIC__/respond.min.js"></script>
<script src="__PUBLIC__/html5shiv.min.js"></script>
<script src="__PUBLIC__/amazeui/js/amazeui.legacy.min.js"></script>
<![endif]-->
<script type="text/javascript">
(function(){
    var ThinkPHP = window.Think = {
        "ROOT"   : "__ROOT__", //当前网站地址
        "APP"    : "__APP__", //当前项目地址
        "PUBLIC" : "__PUBLIC__", //项目公共目录地址
        "DEEP"   : "{:C('URL_PATHINFO_DEPR')}", //PATHINFO分割符
        "MODEL"  : ["{:C('URL_MODEL')}", "{:C('URL_CASE_INSENSITIVE')}", "{:C('URL_HTML_SUFFIX')}"],
        "VAR"    : ["{:C('VAR_MODULE')}", "{:C('VAR_CONTROLLER')}", "{:C('VAR_ACTION')}"]
    }
})();
</script>
</head>
<body class="amz-index">
<!--[if lte IE 9 ]>
    <div class="am-alert am-alert-danger ie-warning" data-am-alert>
        <button type="button" class="am-close">
            &times;
        </button>
        <div class="am-container am-text-center" style="font-size:14px;">
            365 安全卫士提醒：你的浏览器太古董了，请使用更高级的版本，<a href="http://browsehappy.com/" target="_blank">还不速速换一个</a>！
        </div>
    </div>
<![endif]-->
	<div class="login-header">
		<div class="am-g">
			<h1>用户注册</h1>
			<span>已经有账号? <a href="{:U('User/Public/login')}">点此登录</a> </span>
		</div>
		<hr />
	</div>

<div class="am-g">
	<div class="am-u-lg-6 am-u-md-8 am-u-sm-centered">
		<h3 class="am-text-center">用户注册</h3>
		<hr>

		<form action="__SELF__" method="post" class="am-form am-form-horizontal">
			<div class="Validform_checktip"></div>
			<div class="am-form-group">
				<label class="am-u-sm-2 am-form-label">用户名</label>
				<div class="am-u-sm-10">
					<input type="text" placeholder="请输入用户名"  ajaxurl="/member/checkUserNameUnique.html" errormsg="请填写1-16位用户名" nullmsg="请填写用户名" datatype="*1-16" value="" name="username">
				</div>
			</div>

			<div class="am-form-group">
				<label class="am-u-sm-2 am-form-label">密码</label>
				<div class="am-u-sm-10">
					<input type="password" placeholder="请输入密码"  errormsg="密码为6-20位" nullmsg="请填写密码" datatype="*6-20" name="password">
				</div>
			</div>

			<div class="am-form-group">
				<label class="am-u-sm-2 am-form-label">确认密码</label>
				<div class="am-u-sm-10">
					<input type="password" placeholder="请再次输入密码" recheck="password" errormsg="您两次输入的密码不一致" nullmsg="请填确认密码" datatype="*" name="repassword">
				</div>
			</div>

			<div class="am-form-group">
				<label class="am-u-sm-2 am-form-label">邮箱</label>
				<div class="am-u-sm-10">
					<input type="text" placeholder="请输入电子邮件"  ajaxurl="/member/checkUserEmailUnique.html" errormsg="请填写正确格式的邮箱" nullmsg="请填写邮箱" datatype="e" value="" name="email">
				</div>
			</div>

			<div class="am-form-group">
				<label class="am-u-sm-2 am-form-label">验证码</label>
				<div class="am-u-sm-6">
					<input type="text" placeholder="请输入验证码"  errormsg="请填写5位验证码" nullmsg="请填写验证码" datatype="*5-5" name="verify">
				</div>
				<div class="am-u-sm-4"><img class="verifyimg reloadverify" alt="点击切换" src="{:U('verify')}" style="cursor:pointer; height:40px; "></div>
			</div>

			<div class="am-form-group">
				<div class="am-u-sm-10 am-u-sm-offset-2">
					<button type="submit" class="am-btn am-btn-primary am-btn-sm am-fl">注 册</button>
				</div>
			</div>
		</form>
		<hr>
		<p>© 2015 TenSent, Inc. Licensed under Apache2.0 license.</p>
	</div>
</div>
<script type="text/javascript">
	$(document)
		.ajaxStart(function(){
			$("button:submit").addClass("am-btn-loading").attr("disabled", true).text('loading...');
		})
		.ajaxStop(function(){
			$("button:submit").removeClass("am-btn-loading").attr("disabled", false).text('注 册');
		});


	$("form").submit(function(){
		var self = $(this);
		$.post(self.attr("action"), self.serialize(), success, "json");
		return false;

		function success(data){
			if(data.status){
				window.location.href = data.url;
			} else {
				self.find(".Validform_checktip").addClass('am-alert').text(data.info);
				setTimeout(function(){
					self.find(".Validform_checktip").removeClass('am-alert').text('');
				},3000);
				//刷新验证码
				$(".reloadverify").click();
			}
		}
	});

	$(function(){
		var verifyimg = $(".verifyimg").attr("src");
        $(".reloadverify").click(function(){
            if( verifyimg.indexOf('?')>0){
                $(".verifyimg").attr("src", verifyimg+'&random='+Math.random());
            }else{
                $(".verifyimg").attr("src", verifyimg.replace(/\?.*$/,'')+'?'+Math.random());
            }
        });
	});
</script>
</body>
</html>